<template>
  <el-table :data="dataList" border stripe>
    <!-- 索引列 -->
    <el-table-column type="index"></el-table-column>
    <el-table-column prop="realName" label="用户姓名"></el-table-column>
    <el-table-column label="性别">
      <template v-slot="scope">
        <span>{{getGenderLabel(scope.row.gender)}}</span>
      </template>
    </el-table-column>
    <el-table-column prop="idCardNum" label="身份证号"></el-table-column>
    <el-table-column label="操作" width="300px">
      <template v-slot="scope">
        <!-- 编辑按钮 -->
        <role-edit :role-id="scope.row.id" @update-list="updateList"/>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import RoleEdit from "./RoleEdit";
import {getGenderLabel} from "@/utils/constants";

export default {
  name: "RightsTable",
  props: {
    dataList: {
      type: Array,
      requires: true
    }
  },
  components: {
    RoleEdit,
  },
  methods: {
    getGenderLabel,
    updateList(){
      this.$emit("update-list")
    }
  }
}
</script>

<style scoped>

</style>
